<template>
	<view class="all">
		
		<view class="orde"  v-if="alllist.length>0">
		
			<view class="orde_item" v-for="item in alllist" :key="item.id">
				<view class="name same">
					
				  <image class="img" src="@/static/center4/eat.png"></image>
				  <text class="ntxt">{{item.name}}</text>
				  <text class="status">{{item.orderStatus}}</text>
				</view>
				
				<view class="txt">
					<text class="same">下单时间: {{item.payTime}}</text>
					<text class="same">订单号: {{item.orderNo}}</text>
					<text class="same">类型: {{item.orderTypeName}}</text>
					<text class="same">实付:￥{{item.amount}}</text>	
					<text class="same">数量: {{item.num}}</text>
				</view>
				
				
			</view>
			
		</view>
	
		<view class="no" v-else>
			<u-empty
			    mode="car"
			    icon="http://cdn.uviewui.com/uview/empty/car.png"
				text='暂无订单'
			>
			</u-empty>
		</view>
		
	</view>
</template>

<script setup>
import {getallorder} from '@/api/useraApi.js'
import { onMounted, ref } from 'vue';

const alllist=ref([
	{
		name:'至尊披萨',
		orderStatus:'已支付',
		payTime:'2023-3',
		orderNo:'202304020311',
		orderTypeName:'外卖',
		amount:'68',
		num:'1'
	}
	
	
]) //全部订单的列表


//获取全部订单
const getallo=async()=>{
	let res= await getallorder({
			header:{
			"Authorization":uni.getStorageSync('token')	
			}
		})	
	if(res.code==200){
		alllist.value=res.rows.map(item=>{
		item.num='1' 
		return item
		})
	}
	console.log(alllist.value);
}
	
onMounted(()=>{
	getallo()
})
</script>
<style lang="scss">
::v-deep uni-page-wrapper{
	background-color: #f3f3f3;
}
.all{
	padding: 0px 8px;
	background-color: #f3f3f3;

	.orde{
		overflow: hidden;
		.orde_item{
			display: flex;
			flex-direction: column;
			margin:4px;
			padding: 12px 8px;
			background-color: #fff;
			
			.name{
				font-size: 18px;
				font-weight: 700;
				display: flex;
				justify-content: flex-start;
				
				.img{
					width: 24px;
					height: 24px;
				    display: flex;
				}
				.ntxt{
					flex: 1;
					margin-left: 4px;
				}
				
				.status{
					color: #767676;
					font-size: 16px;
					font-weight: 500;
				}
			}
			.txt{
				display: flex;
				flex-direction: column;
				color: #767676;
				font-size: 16px;
			}
			
		}
		
	}
	.same{
		margin: 4px 0px;
	}
}
</style>
